<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<html>
<head>
	<title>登陆</title>
	<meta charset="utf-8">
	<link rel="stylesheet" type="text/css" href="css/main.css">
	<script type="text/javascript" src="js/jquery.js"></script>
</head>


<body>
	<div class="login_head">
		<div class="container">
			<img src="images/logo.png">
		</div>
	</div>

	<div class="login_banner">
		<div class="container">
			<form action="login" method="post">
			<div class="login">
                <div class="login_in">
                    <div class="login_h">后台登陆    ${msg}&nbsp;<span id="msg"></span></div>

                    <div class="user_login">

						<input type="text" placeholder="账号" name="name" id="login_ajax" onblur="login_test_ajax()">

                        <input type="text" placeholder="密码" name="password">
                    </div>
                    <div class="img_code">
                        <input type="text" placeholder="验证码" name="checkimg">

                        <img src="code.jpg" id="cod_img">
                    </div>
                    <input type="submit" class="login_btn" />
					<a href="/mvc/front.html">去看前台页面</a>
                </div>
                
            </div>
			</form>
		</div>

	</div>

	<div class="login_end text_center">版权所有&copy;：新开普电子股份有限公司  豫ICP备08102576号  未经授权本站内容禁止私自转载使用！</div>
</body>


<script>
	function login_test_ajax(){

		var name = document.getElementById("login_ajax").value;

		// 使用谁来请求XMLHttpRequest对象     请求路径    请求的类型      携带的参数     什么时候成功  响应的内容
		var req=new XMLHttpRequest();
		req.open("post","loginajax?name="+name+"")//打开一个请求
		req.send();//发送请求
		//等待响应
		// 响应对应五个状态码，每当readyState属性改变时，就会调用该函数      4？？？
		req.onreadystatechange=function(){
			//获取服务的响应信息     服务器响应就绪   状态码正常
			if (req.readyState==4 && req.status==200)
			{
				var msg = document.getElementById("msg");
				if(req.responseText=="ok"){
					msg.innerHTML="<font color='red'>用户名正确</font>";
				}
				else{
					msg.innerHTML="<font color='#7fffd4'>用户名不存在<font>";
					alert("用户名不存在")
				}
			}
		}
	}
	$(function (){
		$("#cod_img").bind("click",function (){
			$("#cod_img").attr("src","code.jpg");
		})
	})

</script>

</html>